/**
 * Copyright (c) 快宝网络 kuaidihelp.com Co., Ltd. All Rights Reserved 禁止外泄以及用于其它的商业用途
 */

import React, { useState, useEffect, useRef } from 'react';
import ProForm, { ModalForm } from '@ant-design/pro-form';
import type { ProFormInstance } from '@ant-design/pro-form';
import type { PublishItem } from '../../utils';
import { createHtml } from './utils';
import styles from './index.less';

interface PreviewModal {
  content: PublishItem | string | any;
  visible: boolean;
  type?: string;
  onCancel: () => void;
}

const KbPreviewModal = ({ content, visible, type, onCancel }: PreviewModal) => {
  return (
    <ModalForm
      className={styles.main}
      visible={visible}
      title='预览'
      submitter={false}
      modalProps={{
        onCancel,
        destroyOnClose: true,
        bodyStyle: {
          height: 600,
          padding: 0,
          overflow: 'scroll',
        },
      }}
    >
      <iframe srcDoc={createHtml(content, type)} />
    </ModalForm>
  );
};

export default KbPreviewModal;
